// import React from "react";
import React from "./react";


function App (){

  const ref = React.useRef()
  // React.useEffect(()=>{ // 有移动效果
  //   ref.current.style.transform = 'translate(300px)'
  //   ref.current.style.transition = 'all 1s'
  // },[])
  React.useLayoutEffect(()=>{ // 没有移动效果  渲染前执行了
    ref.current.style.transform = 'translate(300px)'
    ref.current.style.transition = 'all 1s'
  },[])

  const style = {
    width: '100px',
    height: '100px',
    backgroundColor: 'red',
    borderRadius: '50%'
  }

  return <div style={style} ref={ref}>

    </div>
}
export default App